<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%
String path = request.getContextPath(); String basePath =
request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<!--[if IE 7]>
<html class="ie7 lt-ie10">
<![endif]-->
<!--[if IE 8]>
<html class="ie8 lt-ie10">
<![endif]-->
<!--[if IE 9]>
<html class="ie9 lt-ie10">
<![endif]-->
<!--[if gt IE 9]>
  <!-->
<html>
<!--<![endif]-->

<head>
<meta charset="utf-8" />
<title>注册 － 美丽说</title>
<base href="<%=basePath%>">
<meta name="description"
	content="来美丽说开启属于你的发现之旅，感受全新的购买体验吧！这里有百万粉丝的时尚大咖、热爱发现美物的生活家、一边旅行一边挖掘好货的higo海淘达人...而他们都将成为你的专属挑款师！还等什么？加入我们，发现流行，占有世界！" />
<meta name="keywords" content="美丽说,higo,衣服,鞋子,包包,配饰,家居,美妆,搭配,团购,美丽说higo" />

<meta http-equiv="x-ua-compatible" content="IE=edge,chrome=1" />
<meta property="qc:admins" content="173137167465514130576375" />
<meta name="chinaz-site-verification"
	content="500e4417-e595-40ac-98da-dec66c97a9e5" />
<link rel="stylesheet" type="text/css"
	href="css/base.css?1607162038.1471376099" />
<!--[if IE 6]>
    <link rel="stylesheet" type="text/css" href="css/ie6.css?1607162038.1471376099" />
    <![endif]-->
<link rel="apple-touch-icon-precomposed"
	href="css/images/custom_icon_precomposed.png" />
<link rel="icon"
	href="http://d04.res.meilishuo.net/pic/_o/75/6e/2f6871f198c0bd7615ffbf9a2f5f_49_48.c5.png"
	type="image/x-icon" />
<link rel="stylesheet" type="text/css"
	href="css/register_new.css?1607162038.1471376099" />
	<script src="http://code.jquery.com/jquery-1.12.3.min.js"></script>
	<!-- 引入封装了failback的接口--initGeetest -->
	<script src="js/gt.js"></script>
</head>
</head>

<body>
	<div class="wrap">
		<div class="reg_wrap">
			<div class="head">
				<a href="/" class="reg_logo"></a> <a href="/" class="welcome_txt"></a>
			</div>
			<div class="main">
				<div class="ad_wrap">
					<img src="css/images/register/ad_img.jpg" width="370" height="353" />
				</div>
				<div class="reg_form" id="mob_reg">
					<form id="registerForm">
						<h3>
							<a href="login.jsp">登录</a>注册美丽说
						</h3>
						<div class="reg_list">
							<p class="reg_box">
								<input class="reg_txt" id="mobile" name="useremail" type="text"
									placeholder="邮箱地址" autocomplete="off" /> <span></span> <span
									class="tel_icon"></span>
							</p>
							<!-- <p class="mlsUserEor red_f"></p> -->
						</div>
						<div class="reg_list">
							<p class="reg_box">
								<input class="reg_txt" id="nickname" name="username" type="text"
									placeholder="用户名" autocomplete="off" /> <span></span> <span
									class="user_icon"></span>
							</p>
							<!-- <p class="mlsUserEor red_f"></p> -->
						</div>
						<div class="reg_list">
							<p class="reg_box">
								<input class="reg_txt" id="password" name="loginpwd"
									type="password" placeholder="密码" autocomplete="off" /> <span></span>
								<span class="pwd_icon"></span>
							</p>
							<div class="pw_safe none_f">
								<span class="txt">安全程度</span>
								<div class="pw_strength pw_weak pw_medium pw_strong">
									<div class="pw_bar"></div>
									<div class="pw_letter">
										<span class="strength_l">弱</span> <span class="strength_m">中</span>
										<span class="strength_h">强</span>
									</div>
								</div>
							</div>
						</div>
						<div class="reg_list confpass">
							<p class="reg_box">
								<input class="reg_txt" id="conf_password" name="conf_password"
									type="password" placeholder="确认密码" autocomplete="off" /> <span></span>
								<span class="pwd_icon"></span>
							</p>
							<!-- <p class="mlsUserEor red_f"></p> -->
						</div>
						<!-- <div class="reg_list">						<p class="reg_box" id="checkBox">							<input type="text" class="reg_txt" id="checkcode" name="checkcode" value="" placeholder="请输入验证码" maxlength="4"/>							<span class="checkImage code_img">								<span class="codeImage" id="checkcodeImage">									<img width="92" height="36" isblank="true" src="css/images/register/blank.jpg">								</span>								<span class="reload_icon"></span>							</span>							<span class="code_icon"></span>							<span class="success"></span>						</p>						<p class="checkCodeEor red_f"></p></div> -->
						<div id="popup-captcha" class="reg_list"></div>
						<div class="reg_list verifcode">
							<!-- <p class="reg_box">
								<input id="code" name="code" class="enter_code reg_txt"
									type="text" placeholder="短信验证码" maxlength="6" /> <input
									id="get_code" class="get_code" value="获取短信验证码" /> <span></span>
							</p> -->
							<!-- <p class="sms_code_msg red_f"></p> -->
						</div>
						<div class="regErrorMessage none_f"></div>
						<div class="reg_btn_wrap">
							<input type="button" onclick="register()" class="reg_btn" value="立即注册" />
						</div>
						<div class="agree_reg">
							<input type="checkbox" checked="checked" id="agreement"
								name="agreement" />同意 <a href="newbags.jsp?wap/1003"
								target="_blank">《美丽说注册条款》</a>
						</div>
					</form>
					<div class="fast_login">
						<h3>无需注册，即可登录</h3>
						<div class="fast_way">
							<a href="/connect/auth/qzone" class="qq_way"></a> <a
								href="/connect/auth/weibo" class="sina_way"></a> <a
								href="/connect/auth/weixin" class="weixin_way"></a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
<script>
	$(function(){
		$.ajax({
		    // 获取id，challenge，success（是否启用failback）
		    url: "/code?t=" + (new Date()).getTime(), // 加随机数防止缓存
		    type: "get",
		    dataType: "json",
		    success: function (data) {
		        // 使用initGeetest接口
		        // 参数1：配置参数
		        // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它做appendTo之类的事件
		        initGeetest({
		            gt: data.gt,
		            challenge: data.challenge,
		            product: "popup", // 产品形式，包括：float，embed，popup。注意只对PC版验证码有效
		            offline: !data.success // 表示用户后台检测极验服务器是否宕机，一般不需要关注
		            // 更多配置参数请参见：http://www.geetest.com/install/sections/idx-client-sdk.html#config
		        }, handlerPopup);
		    }
		});
		
	});
	var flag=false;
	var handlerPopup = function (captchaObj) {
        // 成功的回调
        captchaObj.onSuccess(function () {
            var validate = captchaObj.getValidate();
            $.ajax({
                url: "/VerifyLogin", // 进行二次验证
                type: "post",
                dataType: "json",
                data: {
                    geetest_challenge: validate.geetest_challenge,
                    geetest_validate: validate.geetest_validate,
                    geetest_seccode: validate.geetest_seccode
                },
                success: function (data) {
                    if (data && (data.status === "success")) {
                    	flag=true;
                    }
                }
            });
        });
        /* $("#popup-submit").click(function () {
            captchaObj.show();
        }); */
        // 将验证码加到id为captcha的元素里
        captchaObj.appendTo("#popup-captcha");
        // 更多接口参考：http://www.geetest.com/install/sections/idx-client-sdk.html
    };
    function checkUserName(){
    	var username=$("#nickname").val();
    	if(username==null||username==""){
    		return;
    	}
    	$("#nickname").siblings("#msgmobile").remove();
    	$.ajax({
	        cache:true,
	        type: "POST",
	        url:'/users/checkAccount?username='+username,
	        data:"",// 你的formid
	        async: false,
	        dataType:"json",
	        error: function(request) {
	            alert("Connection error");
	        },
	        success:function(data) {
	        	if(data){
	        		$("#nickname").next().addClass("msg_err");
	        		$("#nickname").parent(".reg_box").append('<div id="msgmobile" class="msg_error"><span></span>该账号已存在。</div>');
	        		return false;
	        	}else{
	        		$("#nickname").next().removeClass("msg_err");
	        		$("#nickname").siblings("#msgmobile").remove();
	        		return true;
	        	}
	        }
	    });
    	return false;
    };
    function checkUserEmail(){
    	$("#mobile").siblings("#msgmobile").remove();
    	var useremail=$("#mobile").val();
    	if(useremail==null||useremail==""){
    		return;
    	}
    	$.ajax({
	        cache:true,
	        type: "POST",
	        url:'/users/checkAccount?useremail='+useremail,
	        data:"",// 你的formid
	        async: false,
	        dataType:"json",
	        error: function(request) {
	            alert("Connection error");
	        },
	        success:function(data) {
	        	if(data){
	        		$("#mobile").next().addClass("msg_err");
	        		$("#mobile").parent(".reg_box").append('<div id="msgmobile" class="msg_error"><span></span>该邮箱地址已存在。</div>');
	        		return false;
	        	}else{
	        		$("#mobile").next().removeClass("msg_err");
	        		$("#mobile").siblings("#msgmobile").remove();
	        		return true;
	        	}
	        }
	    });
    	return false;
    };
    $("#mobile").blur(checkUserEmail);
    $("#nickname").blur(checkUserName);
    
    function register(){
    	if(!checkUserEmail()&&!checkUserName()){
    		if(flag==true){
        		$.ajax({
        	        cache:true,
        	        type: "POST",
        	        url:'/users/register',
        	        data:$('#registerForm').serialize(),// 你的formid
        	        async: false,
        	        error: function(request) {
        	            alert("Connection error");
        	        },
        	        success:function(data) {
        	        	if(data){
        	        		alert('注册成功！');
        	        		setTimeout(function(){//两秒后跳转  
        	                	location.href='login.jsp';
        	                },1000);
        	        	}else{
        	        		alert('注册失败！');
        	        	}
        	        }
        	    });
        	}else{
        		alert("请先完成验证码验证！");
        	}
    	}
    }
</script>
</body>
</html>